/* colors */
.xBlue { 
      color: #01A1E7
}

.xSilver {
color: #d0d1d3
}

.white {
	color: #FFFFFF;
}

.red {
  color: #ff0000;
}

.black {
	background-color: #000000;
}

/* fonts/layout */
.roboto-home {
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-weight: 900;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;

	color: #01A1E7;
	text-align: center;
	font-size: 70px;
  background-color:#000000;
  
}

.roboto-home a:hover {
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-weight: 900;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;

	color: #d0d1d3;
	text-align: center;
	font-size: 70px;
  
}

.roboto-header {
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-weight: 900;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;

	color: #01A1E7;
	text-align: center;
	font-size: 40px;
}

.roboto-content
{
 font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
  font-variation-settings:
    "wdth" 85;

	color: #f3f3f3;
	text-align: center;
	font-size: 20px;

}

.center{
	text-align: center;
}

.wall{
  background-image: url(/Images/wall.jpg);
}
.graffiti {
   font-family: "Sedgwick Ave Display", cursive;
  font-weight: 100;
  font-style: normal;
  font-style: normal;
  font-variation-settings:
    "wdth" 85;
	text-align: center;
	font-size: 40px;
  color: rgba(255, 255, 255, 0.8);
  -webkit-text-stroke: 1.5px black;
  
}

/* animations */
@keyframes fadeIn {

		from {opacity: 0}
		to {opacity: 1}
	 }
	 
.fadein { 
          opacity: 0;
          animation-name: fadeIn;
          animation-duration: 5s;
		  animation-timing-function: ease-out;
		  animation-fill-mode: forwards;
}




/* Pain-a-thon Specific */
.comic-header
{
font-family: 'Comic Sans MS', 'Chalkboard SE', 'Comic Neue', sans-serif;
font-size: 100px;
text-align: center;
color: #ff0000;
text-shadow: 3px 3px black;

}

.comic-content
{
font-family: 'Comic Sans MS', 'Chalkboard SE', 'Comic Neue', sans-serif;
text-align: center;
color: #ffffff;

}

.papyrus-content
{
font-family: 'Papyrus', 'fantasy';
text-align: center;
color: #d8ff00;
font-weight: 900;
text-shadow: 3px 3px 1px black;
}


.size-main
{font-size: 20px;}

.size-header2
{font-size: 50px;}

.size-header3
{font-size: 35px; }

.rainbow
{background-image: url(/Images/rbowdark.png);}